{% extends "base.html" %}
{% block color %}{{ color }}{% endblock %}

{% block functions %}
var counter = 0;
var total_photo_count = {{ count }};
function pollProgress() {
  $.getJSON('/ajax/progress/', {tag_id: {{ tag_id }}},
            function(data) {
              $('#progressbar').progressbar("option",
                                            "value",
                                            data.progress);
            });
}
function tryLoadingNewImage() {
  $.getJSON('/ajax/photo_at/', {index: counter, tag_id: {{ tag_id }}},
            function(data) {
              if (data.error == undefined) {
                $('img#bigimage').attr("src", "/image/" + data.photo_id + "/1");
                counter += 1;
              }
            });
}

function loop() {
  pollProgress();
  tryLoadingNewImage();
  if (counter < total_photo_count) {
    setTimeout("loop()", 1000);
  } else {
    window.location = "/tag/{{ tag_id }}/1";
  }
}
{% endblock %}
{% block script %}
$('div.pager').wrap('<center><h4></h4></center>');
$('#progressbar').progressbar({ value: 0});
loop();
{% endblock %}
{% block title %}{{ name }} loading ...{% endblock %}

{% block content %}
<center><h1>"{{ name }}" loading</h1></center>
<center>
          <img id='bigimage' src='/static/images/no_image.png'>
</center>
<div id="progressbar"></div>
{% endblock %}
